{% extends 'base.html' %}

{% load static %}
{% load main_filters %}

{% block content %}
    <div class="book-big">
        <div class="description-big">
            <img src="{{ book.image.url }}" alt="">
            <div class="content-big">
                <div class="block-characteristic title-big" data-input-to-change-book="title">
                    <span data-title-of-book="true">Название: {{ book.title }}</span>
                </div>  
                <div class="block-characteristic author-big" data-input-to-change-book="author">
                    <span data-author-of-book="true">
                        Автор: {{ book.author }}
                    </span>
                </div>  
                <div class="block-characteristic group-big">Группа: {{ book.group }}</div>  
                <div class="block-characteristic volume-big">Объем книги: {{ book.volume }}</div>  
                <div class="block-characteristic is-defer-big" data-is-defer="{{ book.is_defer }}">
                    Отложена: {{ book.is_defer|convert_boolean }}
                </div>  
                <div class="block-characteristic is-read-big" data-is-read="{{ book.is_read }}">
                    Прочитана: {{ book.is_read|convert_boolean }}
                </div>  
                <div class="block-characteristic added-big">Добавлена: {{ book.added|date:"d-m-Y" }}</div>  
                <div class="block-characteristic description-big" data-input-to-change-book="description">
                    <p data-book-description-text="true">Описание: {{ book.description }}</p>
                </div>  
            </div>
        </div>
        <div class="additional-information-book-big">
            <div class="progress">
                <div class="number-of-pages">
                    <span class="pages">{{ book.last_page }}</span>
                    <span>/</span>
                    <span class="percentages"></span>
                </div>
                <div class="total">
                    <div class="now"></div>
                </div>
            </div>
            <div class="actions-book-big">
                <div class="book-settings action-button" data-open-book-settings="true" data-description="Настройки">
                    <i class="fa-solid fa-gear"></i>
                </div>
                <div class="action-button" data-author="true" data-description="Автор">
                    <a href="{% url 'author:author' name_slug=book.author.slug %}">
                        <i class="fa-solid fa-user"></i>
                    </a>
                    
                </div>
                <div class="action-button favorites" data-favorites="{{ book.is_favorites }}" data-description="Избранная">
                    <form method="post">
                        {% csrf_token %}
                        <button>
                            <i class="fa-solid fa-star" style="font-weight: 100;"></i>
                        </button>
                    </form>
                </div>
                <div class="action-button" data-quotes-window data-description="Цитаты">
                    <i class="fa-solid fa-quote-right"></i>
                </div>
                <div class="bookmark action-button" data-description="Закладки">
                    <a href="{% url 'book' slug=book.slug %}?page={{ book.bookmark }}" class="read">
                        <i class="fa-solid fa-bookmark"></i>
                    </a>
                </div>
                <div class="action-button" data-description="Читать">
                    <a href="{% url 'book' slug=book.slug %}?page={{ book.last_page }}" class="read">
                        <i class="fa-solid fa-book-open"></i>
                    </a>
                </div>
            </div>
        </div>
    </div>

{% endblock content %}